{#
This file is part of EC-CUBE

Copyright(c) EC-CUBE CO.,LTD. All Rights Reserved.

http://www.ec-cube.co.jp/

For the full copyright and license information, please view the LICENSE
file that was distributed with this source code.
#}

{% extends '@admin/default_frame.twig' %}

{% set menus = ['customer', 'customer_edit'] %}

{% block title %}{{ 'admin.customer.customer_registration'|trans }}{% endblock %}
{% block sub_title %}{{ 'admin.customer.customer_management'|trans }}{% endblock %}

{% form_theme form '@admin/Form/bootstrap_4_horizontal_layout.html.twig' %}

{% block javascript %}
    <script src="//yubinbango.github.io/yubinbango/yubinbango.js" charset="UTF-8"></script>
{% endblock javascript %}

{% block main %}
    <form name="customer_form" role="form" id="customer_form" method="post" class="h-adr"
          action="{%- if Customer.id %}{{ url('admin_customer_edit', { id : Customer.id }) }}{% else %}{{ url('admin_customer_new') }}{% endif -%}"
          novalidate>
        <span class="p-country-name" style="display:none;">Japan</span>
        {{ form_widget(form._token) }}
        <div class="c-contentsArea__cols">
            <div class="c-contentsArea__primaryCol">
                <div class="c-primaryCol">
                    <div class="card rounded border-0 mb-4">
                        <div class="card-header">
                            <div class="row">
                                <div class="col-8"><span class="card-title">{{ 'admin.customer.customer_info'|trans }}</span>
                                </div>
                                <div class="col-4 text-right">
                                    <a data-toggle="collapse" href="#ordererInfo"
                                       aria-expanded="false" aria-controls="ordererInfo">
                                        <i class="fa fa-angle-up fa-lg"></i>
                                    </a>
                                </div>
                            </div>
                        </div>
                        <div class="collapse show ec-cardCollapse" id="ordererInfo">
                            <div class="card-body">
                                {% if Customer.id %}
                                    <div class="row mb-2">
                                        <div class="col-3">
                                            <div class="d-inline-block" data-tooltip="true" data-placement="top"
                                                 title="{{ 'tooltip.customer.customer_id'|trans }}">
                                                <span>{{ 'admin.customer.customer_id'|trans }}</span>
                                                <i class="fa fa-question-circle fa-lg ml-1"></i>
                                            </div>
                                        </div>
                                        <div class="col">
                                            <p>{{ Customer.id }}</p>
                                        </div>
                                    </div>
                                {% endif %}
                                <div class="row mb-2">
                                    <div class="col-3">
                                        <span>{{ 'admin.common.name'|trans }}</span>
                                        <span class="badge badge-primary ml-1">{{ 'admin.common.required'|trans }}</span>
                                    </div>
                                    <div class="col">
                                        <div class="row">
                                            <div class="col">
                                                {{ form_widget(form.name.name01) }}
                                            </div>
                                            <div class="col">
                                                {{ form_widget(form.name.name02) }}
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col">
                                                {{ form_errors(form.name.name01) }}
                                            </div>
                                            <div class="col">
                                                {{ form_errors(form.name.name02) }}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row mb-2">
                                    <div class="col-3">
                                        <span>{{ 'admin.common.kana'|trans }}</span>
                                        <span class="badge badge-primary ml-1">{{ 'admin.common.required'|trans }}</span>
                                    </div>
                                    <div class="col">
                                        <div class="row">
                                            <div class="col">
                                                {{ form_widget(form.kana.kana01) }}
                                            </div>
                                            <div class="col">
                                                {{ form_widget(form.kana.kana02) }}
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col">
                                                {{ form_errors(form.kana.kana01) }}
                                            </div>
                                            <div class="col">
                                                {{ form_errors(form.kana.kana02) }}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row mb-2">
                                    <div class="col-3">
                                        <span>{{ 'admin.common.company_name'|trans }}</span>
                                    </div>
                                    <div class="col">
                                        {{ form_widget(form.company_name) }}
                                        {{ form_errors(form.company_name) }}
                                    </div>
                                </div>
                                <div class="row mb-2">
                                    <div class="col-3"><span>{{ 'admin.common.address'|trans }}</span><span
                                                class="badge badge-primary ml-1">{{ 'admin.common.required'|trans }}</span>
                                    </div>
                                    <div class="col">
                                        <div class="mb-3">
                                            <div class="row justify-content-start">
                                                <div class="col-auto pr-0 align-self-center"><span>{{ 'admin.common.postal_symbol'|trans }}</span></div>
                                                <div class="col-2">
                                                    {{ form_widget(form.postal_code) }}

                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col">
                                                    {{ form_errors(form.postal_code) }}
                                                </div>
                                            </div>
                                        </div>
                                        <div class="mb-3">
                                            <div class="row justify-content-start">
                                                <div class="col-auto">
                                                    {{ form_widget(form.address.pref) }}
                                                    {{ form_errors(form.address.pref) }}
                                                </div>
                                            </div>
                                        </div>
                                        <div class="mb-3">
                                            {{ form_widget(form.address.addr01, { attr : { placeholder : 'admin.common.address_sample_01' }} ) }}
                                            {{ form_errors(form.address.addr01) }}
                                        </div>
                                        <div class="mb-3">
                                            {{ form_widget(form.address.addr02, { attr : { placeholder : 'admin.common.address_sample_02' }}) }}
                                            {{ form_errors(form.address.addr02) }}
                                        </div>
                                    </div>
                                </div>
                                <div class="row mb-2">
                                    <div class="col-3">
                                        <span>{{ 'admin.common.mail_address'|trans }}</span>
                                        <span class="badge badge-primary ml-1">{{ 'admin.common.required'|trans }}</span>
                                    </div>
                                    <div class="col">
                                        {{ form_widget(form.email) }}
                                        {{ form_errors(form.email) }}
                                    </div>
                                </div>
                                <div class="row mb-2">
                                    <div class="col-3">
                                        <span>{{ 'admin.common.phone_number'|trans }}</span>
                                        <span class="badge badge-primary ml-1">{{ 'admin.common.required'|trans }}</span>
                                    </div>
                                    <div class="col">
                                        {{ form_widget(form.phone_number) }}
                                        {{ form_errors(form.phone_number) }}
                                    </div>
                                </div>
                                <div class="row mb-2">
                                    <div class="col-3">
                                        <span>{{ 'admin.common.password'|trans }}</span>
                                        <span class="badge badge-primary ml-1">{{ 'admin.common.required'|trans }}</span>
                                    </div>
                                    <div class="col">
                                        {{ form_widget(form.password.first, { type : 'password'}) }}
                                        {{ form_errors(form.password.first) }}
                                    </div>
                                </div>
                                <div class="row mb-2">
                                    <div class="col-3">
                                        <span>{{ 'admin.common.password_for_confirmation'|trans }}</span>
                                        <span class="badge badge-primary ml-1">{{ 'admin.common.required'|trans }}</span>
                                    </div>
                                    <div class="col">
                                        {{ form_widget(form.password.second, { type : 'password'}) }}
                                        {{ form_errors(form.password.second) }}
                                    </div>
                                </div>
                                <div class="row mb-2">
                                    <div class="col-3">
                                        <span>{{ 'admin.common.gender'|trans }}</span>
                                    </div>
                                    <div class="col">
                                        {{ form_widget(form.sex,  {'label_attr': {'class': 'radio-inline'}}) }}
                                        {{ form_errors(form.sex) }}
                                    </div>
                                </div>
                                <div class="row mb-2">
                                    <div class="col-3">
                                        <span>{{ 'admin.common.job'|trans }}</span>
                                    </div>
                                    <div class="col">
                                        {{ form_widget(form.job) }}
                                        {{ form_errors(form.job) }}
                                    </div>
                                </div>
                                <div class="row mb-2">
                                    <div class="col-3">
                                        <span>{{ 'admin.common.birth_day'|trans }}</span>
                                    </div>
                                    <div class="col">
                                        {{ form_widget(form.birth) }}
                                        {{ form_errors(form.birth) }}
                                    </div>
                                </div>
                                <div class="row mb-2">
                                    <div class="col-3">
                                        <span>{{ 'admin.common.point'|trans }}</span>
                                    </div>
                                    <div class="col">
                                        {{ form_widget(form.point) }}
                                        {{ form_errors(form.point) }}
                                    </div>
                                </div>

                                {# エンティティ拡張の自動出力 #}
                                {% for f in form if f.vars.eccube_form_options.auto_render %}
                                    {% if f.vars.eccube_form_options.form_theme %}
                                        {% form_theme f f.vars.eccube_form_options.form_theme %}
                                        {{ form_row(f) }}
                                    {% else %}
                                        <div class="row mb-2">
                                            <div class="col-3">
                                                <span>{{ f.vars.label|trans }}</span>
                                            </div>
                                            <div class="col">
                                                {{ form_widget(f) }}
                                                {{ form_errors(f) }}
                                            </div>
                                        </div>
                                    {% endif %}
                                {% endfor %}

                            </div>
                        </div>
                    </div>

                    {% if Customer.id %}
                        <div class="card rounded border-0 mb-4">
                            <div class="card-header">
                                <div class="row">
                                    <div class="col-8">
                                        <div class="d-inline-block" data-tooltip="true" data-placement="top"
                                             title="{{ 'tooltip.customer.customer_address'|trans }}">
                                        <span class="card-title">
                                            {{ 'admin.customer.customer_address'|trans }}
                                            <i class="fa fa-question-circle fa-lg ml-1"></i>
                                        </span>
                                        </div>
                                    </div>
                                    <div class="col-4 text-right">
                                        <a data-toggle="collapse" href="#delivery" aria-expanded="false"
                                           aria-controls="delivery">
                                            <i class="fa fa-angle-up fa-lg"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="collapse show ec-cardCollapse" id="delivery">
                                {% if Customer.CustomerAddresses|length > 0 %}
                                    <div class="card-body">
                                        <table class="table table-striped table-sm">
                                            <thead class="table-active">
                                            <th class="align-middle pt-2 pb-2">{{ 'admin.common.name'|trans }}</th>
                                            <th class="align-middle pt-2 pb-2">{{ 'admin.common.address'|trans }}</th>
                                            <th class="align-middle pt-2 pb-2 pr-3">{{ 'admin.common.phone_number'|trans }}</th>
                                            <th class="align-middle pt-2 pb-2 pr-3"></th>
                                            </thead>
                                            <tbody>
                                            {% for CustomerAddress in Customer.CustomerAddresses %}
                                                <tr>
                                                    <td class="align-middle">
                                                        {{ CustomerAddress.name01 }}&nbsp;{{ CustomerAddress.name02 }}
                                                    </td>
                                                    <td class="align-middle">
                                                        <a href="{{ url('admin_customer_delivery_edit', { 'id': Customer.id, 'did': CustomerAddress.id }) }}">
                                                            {{ 'admin.common.postal_symbol'|trans }}{{ CustomerAddress.postal_code }} {{ CustomerAddress.Pref }}{{ CustomerAddress.addr01 }}{{ CustomerAddress.addr02 }}
                                                        </a>
                                                    </td>
                                                    <td class="align-middle">
                                                        {{ CustomerAddress.phone_number }}
                                                    </td>
                                                    <td>
                                                        <div class="text-center" data-tooltip="true" data-placement="top" title="{{ 'admin.common.delete'|trans }}">
                                                            <a class="btn btn-ec-actionIcon" data-toggle="modal"
                                                               data-target="#discontinuance-{{ CustomerAddress.id }}">
                                                                <i class="fa fa-close text-secondary"
                                                                   aria-hidden="true"></i>
                                                            </a>
                                                        </div>
                                                        <div class="modal fade" id="discontinuance-{{ CustomerAddress.id }}" tabindex="-1" role="dialog" aria-labelledby="discontinuance" aria-hidden="true">
                                                            <div class="modal-dialog" role="document">
                                                                <div class="modal-content">
                                                                    <div class="modal-header">
                                                                        <h5 class="modal-title font-weight-bold">
                                                                            {{ 'admin.common.delete_modal__title'|trans }}</h5>
                                                                        <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                                                                            <span aria-hidden="true">×</span>
                                                                        </button>
                                                                    </div>
                                                                    <div class="modal-body text-left">
                                                                        <p class="text-left">
                                                                            {{ 'admin.common.delete_modal__message'|trans({ '%name%' : 'admin.common.postal_symbol'|trans ~ CustomerAddress.postal_code ~ CustomerAddress.Pref ~ ' ' ~ CustomerAddress.name01 ~ CustomerAddress.name02 }) }}</p>
                                                                    </div>
                                                                    <div class="modal-footer">
                                                                        <button class="btn btn-ec-sub" type="button" data-dismiss="modal">
                                                                            {{ 'admin.common.cancel'|trans }}
                                                                        </button>
                                                                        <a href="{{ url('admin_customer_delivery_delete', {'id' : Customer.id, 'did':  CustomerAddress.id}) }}" class="btn btn-ec-delete"{{ csrf_token_for_anchor() }} data-method="delete" data-confirm="false">
                                                                            {{ 'admin.common.delete'|trans }}
                                                                        </a>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </td>
                                                </tr>
                                            {% endfor %}
                                            </tbody>
                                        </table>

                                        {# TODO: 新規追加ボタンと文言のデザインを整える #}
                                        {% if Customer.CustomerAddresses|length < eccube_config.eccube_deliv_addr_max %}
                                            <div class="d-block text-center">
                                                <a href="{{ url('admin_customer_delivery_new', { id: Customer.id }) }}"
                                                   class="btn btn-ec-regular">{{ 'admin.customer.customer_address__add'|trans }}</a>
                                            </div>
                                        {% else %}
                                            <span class="ec-errorMessage">
                                                {{ 'admin.customer.customer_address_count_is_over'|trans({"%eccube_deliv_addr_max%":eccube_config.eccube_deliv_addr_max}) }}
                                            </span>
                                        {% endif %}
                                    </div>
                                {% else %}
                                    <div class="card-body">
                                        <div id="address_box" class="data-empty">
                                            <span>{{ 'admin.customer.no_customer_address'|trans }}</span>
                                        </div>

                                        <div class="d-block text-center">
                                            <a href="{{ url('admin_customer_delivery_new', { id: Customer.id }) }}"
                                               class="btn btn-ec-regular">{{ 'admin.customer.customer_address__add'|trans }}</a>
                                        </div>

                                    </div>
                                {% endif %}
                            </div>
                        </div>
                    {% endif %}

                    {% if Customer.id %}
                        <div class="card rounded border-0 mb-4">
                            <div class="card-header">
                                <div class="row">
                                    <div class="col-8">
                                        <div class="d-inline-block" data-tooltip="true" data-placement="top"
                                             title="{{ 'tooltip.customer.purchase_history'|trans }}">
                                        <span class="card-title">
                                            {{ 'admin.customer.purchase_history'|trans }}
                                            <i class="fa fa-question-circle fa-lg ml-1"></i>
                                        </span>
                                        </div>
                                    </div>
                                    <div class="col-4 text-right">
                                        <a data-toggle="collapse" href="#orderHistory" aria-expanded="false"
                                           aria-controls="orderHistory">
                                            <i class="fa fa-angle-up fa-lg"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="collapse show ec-cardCollapse" id="orderHistory">
                                {% if Customer.Orders|length > 0 %}
                                    <div class="card-body">
                                        <table class="table table-striped table-sm">
                                            <thead class="table-active">
                                            <th class="align-middle pt-2 pb-2 pl-3">{{ 'admin.order.order_date'|trans }}</th>
                                            <th class="align-middle pt-2 pb-2">{{ 'admin.order.order_no'|trans }}</th>
                                            <th class="align-middle pt-2 pb-2">{{ 'admin.order.purchase_price'|trans }}</th>
                                            <th class="align-middle pt-2 pb-2 pr-3">{{ 'admin.order.order_status'|trans }}</th>
                                            </thead>
                                            <tbody>
                                            {% for Order in Customer.Orders %}
                                                <tr>
                                                    <td class="align-middle pl-3">{{ Order.order_date|date_min }}</td>
                                                    <td class="align-middle">
                                                        <a href="{{ url('admin_order_edit', { 'id' : Order.id }) }}">
                                                            {{ Order.order_no }}
                                                        </a>
                                                    </td>
                                                    <td class="align-middle">{{ Order.total|price }}</td>
                                                    <td class="align-middle pr-3">
                                                        <span class="badge badge-ec-blue" style="background-color: #fff; color: {{ Order.OrderStatusColor }}; border-color: {{ Order.OrderStatusColor }}">{{ Order.OrderStatus }}</span>
                                                    </td>
                                                </tr>
                                            {% endfor %}
                                            </tbody>
                                        </table>
                                    </div>
                                {% else %}
                                    <div class="card-body">
                                        <div id="history_box" class="data-empty">
                                        <span>
                                            {{ 'admin.customer.no_purchase_history'|trans }}
                                        </span>
                                        </div>
                                    </div>
                                {% endif %}
                            </div>
                        </div>
                    {% endif %}

                    <div class="card rounded border-0 mb-4">
                        <div class="card-header">
                            <div class="row">
                                <div class="col-8">
                                    <div class="d-inline-block" data-tooltip="true" data-placement="top"
                                         title="{{ 'tooltip.customer.shop_memo'|trans }}">
                                        <span class="card-title">{{ 'admin.common.shop_memo'|trans }}</span>
                                        <i class="fa fa-question-circle fa-lg ml-1"></i>
                                    </div>
                                </div>
                                <div class="col-4 text-right">
                                    <a data-toggle="collapse" href="#shopMemo" aria-expanded="false"
                                       aria-controls="shopMemo">
                                        <i class="fa fa-angle-up fa-lg"></i>
                                    </a>
                                </div>
                            </div>
                        </div>
                        <div class="collapse show ec-cardCollapse" id="shopMemo">
                            <div class="card-body">
                                {{ form_widget(form.note, { 'attr': { 'row': 8 }}) }}
                                {{ form_errors(form.note) }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="c-conversionArea">
            <div class="c-conversionArea__container">
                <div class="row justify-content-between align-items-center">
                    <div class="col-6">
                        <div class="c-conversionArea__leftBlockItem">
                            <a class="c-baseLink"
                               href="{{ url('admin_customer_page', { page_no : app.session.get('eccube.admin.customer.search.page_no')|default('1') } ) }}?resume=1">
                                <i class="fa fa-backward" aria-hidden="true"></i>
                                <span>{{ 'admin.customer.customer_list'|trans }}</span>
                            </a>
                        </div>
                    </div>
                    <div class="col-6">
                        <div id="ex-conversion-action" class="row align-items-center justify-content-end">
                            <div class="col-auto">
                                {{ form_widget(form.status) }}
                                {{ form_errors(form.status) }}
                            </div>
                            <div class="col-auto">
                                <button class="btn btn-ec-conversion px-5"
                                        type="submit">{{ 'admin.common.registration'|trans }}</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
{% endblock %}
